In this lesson, you will learn about the blur event in the jQuery works. This event is a form-related event and is fired when a user tabs out of text field or clicks outside of the currently focused text field or area. This event is usually used to validate text field input date. Introduction to... » read more
In this lesson, you will learn how to use click events in jQuery. The .click() function in jQuery binds a function (event handler) to the click event on a selected element. It allows you to make interactive web pages and perform a certain action whenever the click event is fired. Introduction of Click event in... » read more
In this lesson, you will learn what events are and how they make web pages interactive. jQuery is an event-driven scripting language which means it adds interactivity to web pages and can do interesting stuff in respond of events. These events could be pressing a key, loading the page in the web browser, moving a... » read more
In this lesson, you will learn how to delay effects or animations using .delay() function in jQuery. This function is used in a scenario where you want to delay a specific animation. It allows you to delay the execution of the following functions in a sequence or queue. Introduction to delay animations in jQuery The... » read more
In this lesson, you will learn how to animate a web element using .animate() jQuery function. Introduction to Animation in jQuery They syntax of .animate() function has two variants. .syntax ( {json object of properties} [, duration] [, easing function] [, callback function ]) Or .syntax ( {json object of properties }, options ) The... » read more
In this lesson, you will learn how to display a hidden web element or hide an already visible element using jQuery sliding up or down effects. This kind of animation can be achieved using .slideUp() and .slideDown() functions, as we have learned in the previous lesson. But to minimize the code, the right method is... » read more
In this lesson, you will learn how to hide the selected element on the web page by sliding it in the up direction. Introduction The syntax of .slideUp() function is: .slideUp( [duration] [easing function ] [call back function]) The slideUp() function animates the height of a selected element, which seems like hiding the element by... » read more
In this lesson, you will learn how to hide a selected element by fading it to transparent or show already hidden element by fading out it to opaque. Introduction The syntax for fadeToggle() function in jQuery is: fadeToggle([duration] [,easing function name] [, callback function ]) If you skip these parameters, .fadeToggle() function will use the... » read more
In this lesson, you will learn how to hide the selected element on the web page by fading it to transparent. Introduction The syntax for fadeout() function in jQuery is: fadeOut([duration] [,easing function name] [, callback function ]) All of these three parameters are optional. The .fadeOut() function hides the selected element by animating its... » read more
In this lesson, you will learn how to show an invisible element by fading it to opaque. Introduction The signature of .fadeIn() function has three parameters. fadeIn( [duration] [, easing] [, call back function] ) With .fadeIn() function, you can animate the opacity of the selected element. However, it won’t let you specify the final... » read more
In this lesson, you will learn how to show an invisible element or hide a visible element on a web page using jQuery. Introduction The signature of toggle() function is similar to the signature of the show() or hide() function of the jQuery. toggle( duration [, easing function ] [, complete]) With no parameter, the... » read more
In this lesson, you will learn how to show an invisible element on a web page using jQuery. Introduction The signature of the show() function is similar to the hide() function of the jQuery. show( duration [, easing function ] [, complete]) Duration could be a string( slow, normal, fast) or number( representation of time... » read more
In this lesson, you will learn how to hide an element on a web page using jQuery. Introduction The signature of the hide() function is: hide( [duration [, easing] [, call back function ]] ) All of these parameters are optional. Duration could be a string (slow, normal, fast) or a number(a representation of time in... » read more
In this lesson, you will learn about the basics of jQuery effects; how to select elements, and how to apply effects, like showing or hiding an element. These are jQuery’s built-in effects and animation functions. Making elements appear and disappear is a common JavaScript functionality which is helpful to create features like drop-down navigation menus,... » read more
In this lesson, we will learn the different ways jQuery can interact with HTML elements, such as changing their CSS properties and attributes. CSS and jQuery interaction jQuery’s provides a css() function which allows you to change CSS property of any element on your page. You can change multiple properties at once as well, thanks... » read more
